document.querySelector('.video ul').onclick = function() {
document.body.style.overflow = 'hidden'
document.querySelector('.video-wrapper').style.display = 'block'
}
document.querySelector('.video-wrapper .close').onclick = function() {
document.body.style.overflow = 'auto'
document.querySelector('.video-wrapper').style.display = 'none'

document.querySelector('.video-wrapper video').pause()
}
let cols = [
    {left:0, top: 0},
    {left:254, top: 0},
    {left:254*2, top: 0},
    {left:254*3, top: 0},
]
let videoHeight = 0
function Waterfall()
{
for( let num=1;num<=56;num++){
let liObj=document.createElement("li")
liObj.style.position="absolute"
liObj.style.display="none"
liObj.innerHTML=`
<div>
<img src="./assets/imgs2/${num}.jpg" alt="">
</div>
<span>${num}初秋絮语，用音乐记下你的点点滴滴</span>
<p>
<i class="iconfont icon-aixin"></i>${num}${num}.6w喜欢
</p>`
document.querySelector(".video ul").appendChild(liObj)

liObj.querySelector('img').onload = function() { let minHeightIndex =  0
cols.forEach((item,i) => {
if (cols[minHeightIndex].top > item.top)
{
minHeightIndex = i
}
})
liObj.style.display = 'block' 
liObj.style.left = cols[minHeightIndex].left + 'px'
liObj.style.top = cols[minHeightIndex].top + 'px'
cols[minHeightIndex].top += liObj.offsetHeight  
videoHeight = cols[minHeightIndex].top
}
}
}
window.onscroll = function() {
let clientHeight = window.innerHeight || document.documentElement.clientHeight
let scrollHeight = document.documentElement.scrollTop || document.body.scrollTop 

if (clientHeight + scrollHeight >= videoHeight)
{
    console.log(`%c 第${document.querySelectorAll('.video li').length/56}次追加`, 'color:red;font-size:25px;')
    console.log(`%c 第${document.querySelectorAll('.video li').length/56}次追加`, 'color:red;font-size:25px;')
    console.log(`%c 第${document.querySelectorAll('.video li').length/56}次追加`, 'color:red;font-size:25px;')
    console.log(`%c 第${documentquerySelectorAll('.video li').length/56}次追加`, 'color:red;font-size:25px;')
    console.log(`%c 第${document.querySelectorAll('.video li').length/56}次追加`, 'color:red;font-size:25px;')
    Waterfall()
    }
}
window.addEventListener('load', Waterfall)